/* 样式重置 */
body {
  margin: 0;
  overflow-y: hidden;
  font-family: Helvetica, "Source Han Sans CN"
}
html, body {
  height: 100%;
}
div { box-sizing: border-box; }
p, ul { margin: 0 }
ul { padding: 0 }
img { vertical-align: top; }
ul {
  list-style-type: none;
}


/* 布局样式 */

/* 类似于 float:left 列表布局 */

.dib-box {
  display: flex;
  flex-flow: row;
  justify-content: flex-start;
}

.justify {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.center-body {
  align-self: center;
}

  /* 使用空标签生成一个高度100%的参照元素 */
  .center-hack {
    display: inline-block;
    font-size: 0;
    width: 0;
    height: 100%;
    vertical-align: middle;
  }
  

/* 兼容 IE 9 */
.ie9-body {

  .dib {
    display: inline-block;
  }

  .dib-box {
    font-size: 0;
  }

  @media (-webkit-min-device-pixel-ratio: 0) {
    .dib-box {
      letter-spacing: -5px;
      /* Safari 5- 等不支持 font-size: 0 的浏览器 */
    }
  }

  .dib-box .dib {
    vertical-align: top;
    font-size: 14px;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: inherit;
  }

  /* 两端对齐布局 */
  .justify,
  .dib-box .justify {
    font-size: 0;
    line-height: inherit;
  }

  .justify {
    text-align: justify;
    text-justify: inter-ideograph;
    -moz-text-align-last: justify;
        text-align-last: justify;
  /**
    * 不支持 text-align-last 的浏览器用伪元素模拟
   * 1. margin-left:100% 仅 WebKit 支持
    */
    &::after {
      content: "";
      display: inline-block;
      width: 100%;
    }
  }

  /* 子元素取消两端对齐 */
  .justify .dib {
    -moz-text-align-last: auto;
        text-align-last: auto;
    text-justify: auto;
    text-align: left;
    font-size: 14px;
    letter-spacing: normal;
    word-spacing: normal;
  }

  .center {
    text-align: center;
    font-size: 0;
  }

  .center-body {
    letter-spacing: normal;
    word-spacing: normal;
    display: inline-block;
    font-size: 14px;
    vertical-align: middle;
    white-space: normal;
    word-wrap: break-word;
  }
  
}